<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ include file="/WEB-INF/jsp/component/common.jsp" %>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" >
    <title>smart列表</title>
    <link rel="stylesheet" href="${assets}/css/bootstrap.min.css" type="text/css">
    <link rel="stylesheet" href="${frames}/css/lib/bootstrap-table.min.css" type="text/css">
    <link rel="stylesheet" href="${newframe}/css/base/base.css">
    <link rel="stylesheet" href="${frames}/Chronic/css/headBase.css">
    <link rel="stylesheet" href="${frames}/Chronic/css/smart.css">
    <script src="${assets}/js/jquery-1.9.1.min.js"></script>
    <script src="${assets}/js/bootstrap.min.js"></script>
    <script src="${frames}/js/lib/bootstrap-table.js"></script>
    <script src="${frames}/js/lib/bootstrap-table-zh-CN.js"></script>
    <script src="${frames}/Chronic/laydate/laydate.js"></script>
</head>
<body>
    <div class="wrap">
        <div class="header">
            <span class="logo">
                <img src="${frames}/Chronic/ChronicImg/logo.png" alt="美康医卫士">
            </span>
            <div class="loginUser">
                <span class="loginU">登录用户:</span>
                <span class="name">${username}</span>
            </div>
        </div>
        <div class="nav">
            <ul>
                <li><a href="${ctx}/chronic/getBpList?username=${user_name}&&pwd=${pwd}">血压</a></li>
                <li><a href="${ctx}/chronic/getBsList?username=${user_name}&&pwd=${pwd}">血糖</a></li>
                <li class="nav_cur"><a href="${ctx}/chronic/getSmartList?username=${user_name}&&pwd=${pwd}">Smart</a></li>
<%--                <li><a href="${ctx}/chronic/getBpList">血压</a></li>
                <li><a href="${ctx}/chronic/getBsList">血糖</a></li>
                <li class="nav_cur"><a href="${ctx}/chronic/getSmartList">Smart</a></li>--%>
            </ul>
        </div>
        <div class="content">
	        <div class="datepicker">
	            <label>日期：</label>
	            <input id="beginDate" type="text"  class="lay-date" placeholder="选择日期" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})" readonly>
	            &emsp;到&emsp;
	            <input id="endDate" type="text"  class="lay-date" placeholder="选择日期" onclick="laydate({istime: true, format: 'YYYY-MM-DD'})" readonly>
	            <button id="btn_search" class="btn btn-primary">查询</button>
	        </div>
	        <div class="lineTable" >
	            <table id="smartTable" class="abnormalList"
	                   data-toggle="table"
	                   data-pagination="true">
	                <thead>
	                <tr>
	                    <th data-field="testTime">时间</th>
	                    <th data-field="testKindName">类别</th>
	                    <th data-field="testItemName">项目</th>
	                    <th data-field="testValue">数值</th>
	                    <th data-field="referValue">参考值</th>
	                </tr>
	                </thead>
	            </table>
	        </div>
    	</div>
    </div>
<script type="text/javascript">
	function initSmartTable(){
		$('#smartTable').bootstrapTable('destroy');
		$("#smartTable").bootstrapTable({
			method: "get",  //使用get请求到服务器获取数据  
            url: "${URL_CHRONIC_SEARCHSMARTLIST}", //获取数据的Servlet地址  
            //cache: false,
            //striped: true,  //表格显示条纹  
            pagination: true, //启动分页  
            pageSize: 20,  //每页显示的记录数  
            pageNumber:1, //当前第几页  
            pageList: [20, 30, 50],  //记录数可选列表  
            search: false,  //是否启用查询   
            sidePagination: "server", //表示服务端请求  
            //设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder  
            //设置为limit可以获取limit, offset, search, sort, order  
            queryParamsType : "undefined",   
            queryParams: function queryParams(params) {   //设置查询参数  
              var param = {    
                  pageNumber: params.pageNumber,    
                  pageSize: params.pageSize,  
                  beginDate : $("#beginDate").val(),
                  endDate : $("#endDate").val()
              };    
              return param;                   
            },
            onLoadSuccess: function(){  //加载成功时执行  
            	//alert("加载成功");
              	//layer.msg("加载成功");  
            },  
            onLoadError: function(){  //加载失败时执行  
            	alert("加载数据失败");
              //layer.msg("加载数据失败", {time : 1500, icon : 2});  
            }  
          });    
	}
	
	$(document).ready(function () {          
        //调用函数，初始化表格  
        initSmartTable();  
        $(window).resize(function () {
            $('.smartTable').bootstrapTable('resetView');
        });
        $("#btn_search").bind("click", initSmartTable);
        $('.nav ul li').click(function(){
            //alert(78)

            $(this).addClass('nav_cur').siblings().removeClass('nav_cur');

        })
    }); 
</script>
</body>
</html>